<template>
	<view class="">
		<view class="">
			<!-- 2.0.19支持autoBack，默认为false -->
			<u-navbar leftText="我的格子铺" autoBack>
			</u-navbar>
		</view>
		<view class="con-body wrap">

			<view class="main-service uni-cell-90" style="margin-top: 35rpx;">
				<view class="iconType1">
					<u-cell-group :border="false">
						<view class="card-head">
							<u-cell :border="false">
								<view slot="icon">
									<u-avatar mode="aspectFill" :src="user.avatar" size="60"></u-avatar>
								</view>
								<view slot="label" style="margin-left: 10rpx;">
									<view>
										<text style="font-size: 32rpx;">{{user.username}}</text>
									</view>
									<view v-if="user.type == 1"
										style="margin-top: 20rpx; font-size: 26rpx; color: #696969;">
										<text>业主</text>
									</view>
									<view v-else-if="user.type == 2"
										style="margin-top: 20rpx; font-size: 26rpx; color: #696969;">
										<text>家人</text>
									</view>
									<view v-else-if="user.type == 3"
										style="margin-top: 20rpx; font-size: 26rpx; color: #696969;">
										<text>租户</text>
									</view>
									<view v-else style="margin-top: 20rpx; color: #696969;">

										<text>访客</text>
									</view>
								</view>
							</u-cell>
						</view>

					</u-cell-group>
				</view>
				<view style="margin-top: 20rpx; background-color: #fefefe; border-radius: 20rpx;
				box-shadow: 5rpx 5rpx 20rpx rgba(0,0,0,0.15);">
					<u-cell-group style="margin-top: 10rpx;" :border="false">
						<u-cell :border="false" isLink @click="myRelease"
							icon="https://resourse.cnlhjt.com/upload/20220825/8da1f16424e6e4abae304d9b5be2fd3d.png" title="我的发布"></u-cell>
						<u-cell :border="false" isLink @click="myComment"
							icon="https://resourse.cnlhjt.com/upload/20220825/15e78868d003a8923966a588bc1282d8.png" title="我的评论"></u-cell>
						<u-cell :border="false" isLink @click="myGood"
							icon="https://resourse.cnlhjt.com/upload/20220825/7482d37b8cbbfa837e0b5104397fec61.png" title="我的点赞"></u-cell>
						<u-cell :border="false" isLink @click="myOrder"
							icon="order" :iconStyle="style" title="我的订单"></u-cell>
					</u-cell-group>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { getInfo } from "@/service/userService.js";
	export default {
		data() {
			return {
				user: {},
				style:{
					color:'#0B898E',
					fontSize:'42rpx'
				}
			}
		},
		onLoad() {
			getInfo().then(this.getInfo);
		},
		methods: {
			getInfo(e){
				if(e.code ==200){
					this.user = e.result;
				}
			},
			myRelease() {
				this.$u.route({
					url: "/pagesShare/mine/release",
					params: {}
				})
			},
			myComment() {
				this.$u.route({
					url: "/pagesShare/mine/comment",
					params: {}
				})
			},
			myGood() {
				this.$u.route({
					url: "/pagesShare/mine/good",
					params: {}
				})
			},
			myOrder() {
				this.$u.route({
					url: "/pagesShare/mine/latticeOrder",
					params: {}
				})
			},
			
		}
	}
</script>

<style lang="scss">
	.wrap {
		width: 94%;
		margin-left: 3%;
		margin-bottom: 44rpx;
	}

	.card-head {
		border-radius: 20rpx;
	}

	.iconType1 {
		display: flex;
		padding: 10rpx 20rpx;
		background-color: #fefefe;
		box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.15);
		border-top-left-radius: 20rpx;
		border-top-right-radius: 20rpx;
		justify-content: space-between;
	}

	.iconType {
		display: flex;
		padding: 30rpx 60rpx;
		background-color: #fefefe;
		box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.15);
		border-bottom-left-radius: 20rpx;
		border-bottom-right-radius: 20rpx;
		justify-content: space-between;
	}

	.icon {
		height: auto;
		margin-bottom: 10rpx;
	}

	.item {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 28rpx;
		color: #333333;
	}
</style>
